@extends('layouts.back_stage')
@section('style')
    @parent
    <style>
        *{margin:0;padding:0;}
        .top{width:100%;height:30px;margin:20px 0 20px 0;}
        .top h3{width:300px;height:30px;line-height:30px;float:left;margin:0;}
        .top .btn-primary{float:right;margin-right:5px;}
        .top .btn-success{float:right}
        .apply-list{width:100%;height:auto;}
        .apply-list .apply_ul{width:100%;height:auto;list-style-type: none;}
        .apply-list .apply_ul .apply-item{width:100%;height:50px;}
        .apply-list .apply_ul .apply-item .inp1{width:170px;height:30px;outline:none;margin-right: 30px;padding-left:5px;float:left;}
        .apply-list .remark{width:770px;height:30px;outline:none;float:left;padding-left:5px;}
    </style>
@endsection
@section('content')
    <div class="container">
        @if(empty($apply_id))
            <div class="top">
                <h3>新增要货申请单</h3>
                <button class="btn btn-success" onclick="applyList()">提交申请单</button>
                <button class="btn btn-primary subtract" onclick="subList()" style="width:40px">-</button>
                <button class="btn btn-primary" onclick="addList()">＋</button>
            </div>
        @else
            <div class="top">
                <h3>编辑要货申请单</h3>
                <button class="btn btn-success" onclick="applyList()">提交申请单</button>
                <button class="btn btn-primary" onclick="subList()" style="width:40px">-</button>
                <button class="btn btn-primary" onclick="addList()">＋</button>
            </div>
        @endif
        <div class="apply-list">
            <input type="hidden" id="company_id" value="{{$company_id}}">
            <input type="hidden" id="clickNum" value="1">
            <input type="hidden" class="number" value="0">
            <ul class="apply_ul">
                <li class="apply-item">
                    <select class="inp1 inp" id="brand_1">
                        <option value="">品牌</option>
                        @foreach($brand as $key => $value)
                            <option value="{{$value}}">{{$key}}</option>
                        @endforeach
                    </select>
                    <input class="inp1 inp" type="text" placeholder="款号" id="item_1">
                    <input class="inp1 inp" type="text" placeholder="颜色" id="color_1">
                    <input class="inp1 hand inp" type="text" placeholder="手数" id="num_1" maxlength="5">
                </li>
            </ul>
            <input class="remark" type="text" placeholder="备注" id="remark"><br/>
        </div>
    </div>
    <script>
        $(".hand").bind("input","onpropertychange",function(){
			$(this).val($(this).val().replace(/[^\d]/g,""));
		})

        function subList() {
            var clickNum = $('#clickNum').val();
            $('#clickNum').val(parseInt(clickNum)-1);
            $(".apply_ul .apply-item:last").remove();
            if($(".apply-item").length<=0){
                $(".remark").hide();
            }
        }

        function addList() {
            if($(".apply-item").length>=0){
                $(".remark").show();
            }
            var clickNum = $('#clickNum').val();
            $('#clickNum').val(parseInt(clickNum)+1);
            var num =$('#clickNum').val();
            var li = '<li class="apply-item">'+
                        '<select class="inp1 inp" id="brand_'+num+'"></select>'+
                        '<input class="inp1 inp" type="text" placeholder="款号" id="item_'+num+'">'+
                        '<input class="inp1 inp" type="text" placeholder="颜色" id="color_'+num+'">'+
                        '<input class="inp1 hand inp" type="text" placeholder="手数" id="num_'+num+'" maxlength="5">'+
                    '</li>'
            $('.apply-list ul').append(li);
            var obj='{!!$brands!!}';
            var s='<option value="">品牌</option>';
            var s1='<option value=""></option>'
            for(var i in obj){
                //console.log(i);
                //console.log(obj[i]);
                s+='<option value='+obj[i]+'>'+i+'</option>'
            }
            $("#brand_"+num).append(s);
        }
        function applyList() {
            var num =$('#clickNum').val();
            var company_id =$('#company_id').val();
            var remark =$('#remark').val();
            var brand = '';
            var item = '';
            var color = '';
            var sale_num = '';
            for(var i=1;i<=parseInt(num);i++){
                brand += $('#brand_'+num).val()+',';
                item += $('#item_'+num).val()+',';
                color += $('#color_'+num).val()+',';
                sale_num += $('#num_'+num).val()+',';
            }
            $(".inp").each(function(){
                var vl=$(this).val();
                if(vl==""){
                    $(".number").val(2);
                    return false;
                }else{
                    $(".number").val(1)
                }
            });
            if($(".number").val()==2){
                $(".faceImg").attr("src","/img/weep.png");
                $(".oHandle").text("请把信息填写完整");
                $(".oSuccess").show(0).delay(1000).hide(0);
            }
            if($(".number").val()==1){
                $.ajax({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf_token"]').attr('content')
                    },
                    url:'/applyForCargo/store',
                    type:'post',
                    data:{
                        'brand':brand,
                        'item':item,
                        'color':color,
                        'sale_num':sale_num,
                        'company_id':company_id,
                        'remark':remark
                    },
                    success:function (data) {
                        //console.log(data);
                        //alert(data.msg);
                        window.location.href = '/applyForCargo'
                    }
                })
            }
        }
    </script>
@endsection